<template>
  <div class="handle">
    <div class="handle_box">
      <el-menu
          :default-active=active
          class="el-menu-demo"
          mode="horizontal"
          router
      >
        <el-menu-item index="/OA/my-handled/all">全部</el-menu-item>
        <el-menu-item index="/OA/my-handled/to-handle">待审批</el-menu-item>
        <el-menu-item index="/OA/my-handled/handled">已审批</el-menu-item>
      </el-menu>
      <router-view></router-view>
    </div>
  </div>
</template>

<script setup>
import {ElMenu, ElMenuItem, ElInput} from "element-plus"
import {onMounted, ref} from "vue"
import emitter from "@/lib/eventBus.js"
import {useRouter} from "vue-router"

const router = useRouter()
emitter.on('update',(key)=>{
  active.value = key
})

onMounted(()=>{
  emitter.emit('home_menu','/OA/my-handled/all')
  // router.push('/OA/my-handled/all')
})

const active = ref('/OA/my-handled/all')

const updateActive = () => {

}
</script>

<style scoped lang="less">
.handle{
  height: 110vh;
  width: 94vw;
  display: flex;
  margin-left: 5vw;
  .handle_box{
    margin-top: 1.5vh;
    margin-left: 4vw;
    width: 95%;
    height: 88%;
    box-sizing: border-box;
    border-radius: 10px;
    box-shadow: 0 0 7px 7px lightgray;
    background-color: rgba(250, 250, 250);
    .el-menu-demo{
      width: 99.5%;
      margin: 5px auto;
    }
    .search-box{
      margin-top: 1vh;
      text-align: left;
      padding-left: 1vw;
    }
  }
}
</style>
